
{extend name="index@common/base"/}
{block name="style"}
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.2&key=b32b75e11b6769096d4222213f95de96"></script>
<link rel="stylesheet" href="__CSS__/index/index.css">
<link rel="stylesheet" href="__CSS__/rehearse/panorama.css" media="all">
{/block}
{block name="top"}
<div class="park-header">
    <div class="park-logo">建德安环一体化管理系统</div>
		{if $id}
   	<form class="layui-form" >
       	<div class="layui-form-item">
  			<div class="layui-input-block">
		      	<select name="distancechoose" lay-filter="distancechoose">
			        <option value="1">1公里</option>
			        <option value="2">2公里</option>
			        <option value="3">3公里</option>
		      	</select>
   			</div>
 		</div>
  	</form>
	<div class="boardList">
        <ul>
        	<li>
        		<input type="checkbox" id="btn-camera">
        		<label for="btn-camera"><i class="fa fa-video-camera"></i></label>
        		<span >监控摄像</span>
        	</li>
        	<li>
        		<input type="checkbox" id="btn-equipe">
        		<label for="btn-equipe"><i class="fa fa-cubes"></i></label>
        		<span>装备物资</span>
        	</li>
        	<li>
        		<input type="checkbox" id="btn-resuce">
        		<label for="btn-resuce"><i class="fa fa-ambulance"></i></label>
        		<span>救援单位</span>
        	</li>
        	<li>
        		<input type="checkbox" id="btn-danger">
        		<label for="btn-danger"><i class="fa fa-warning"></i></label>
        		<span>危险源</span>
        	</li>
        	
        </ul>
    </div>
	{/if}
	{if $id}
    <div class="warnStatus">
    	<p>正在告警</p>
    </div>
	{else if}
	<div class="warnStatus" >
		<p style="color: lawngreen">暂无告警</p>
	</div>
	{/if}

    <div class="park-none"></div>
    <div class="park-weather" data-weather="{:config('basic.weather_area')}">
	</div>
    <div class="park-screen full-screen" onclick="launchFullscreen(document.documentElement);">
		    	
	 </div>
 </div>
{/block} 
{block name="body"}
<div class="index-body park-body" id="cont">
    <div class="container" style="width:100%;height:100%;position:relative">
        <!-- 地图 -->
        <div id="allmap" class="map" data-url="{:url('index/ajax.map/aerialPhotoLayers')}" data-center="{}">
			{if $id}
        	<input type="hidden" id="center" value="{$position}">
			<input type="hidden" id="enterprise" value="{$enterprise}">
			<input type="hidden" id="dangersource" value="{$dangersource}">
			<input type="hidden" id="event" value="{$id}">
			{else if}
			<input type="hidden" id="event" value="0">
			{/if}

        </div>
		{if $id}
        <!-- 地图上的表单 -->
        <div class="matter" id="matter" style="min-width: 1280px;">
        	<div class="bottom-slide">
        		<i class="fa fa-chevron-down"></i>
        	</div>
        <!-- 演练方案 -->
            <div class="tabbox">
                <div class="tabtitle"><img src="__IMG__/tab.png">演练方案</div>
                <div class = "maintab">
                    <table class="layui-hide" id="record" lay-filter="record" data-url="{:url('duty/panorama/index')}"></table>
                </div>
                <div class="tabfoot">
                    <div id="approve-menu1"></div>
                </div>
            </div>
            <!-- 实时反馈 -->
            <div class="tabbox">
                <div class="tabtitle"><img src="__IMG__/tab.png">实时反馈</div>
                <div class = "maintab">

                </div>
                <div class="tabfoot">

                    <div id="alarm-menu1">

                    </div>
                </div>
            </div>
        </div>

        <!-- 物资装备 -->

        <div class="right-side-tab">
        	 <div class="tab-box">
                <div class="tab-title">
                	<div class="tab this" data-target="material">物资装备</div>
                	<div class="tab" data-target="rescue">救援单位</div>
                	<div class="tab" data-target="danger_source">危险源</div>
                	<div class="right-slide"><i class="fa  fa-chevron-right"></i></div>
                </div>
                <div class="tab-content">
                	<div class="tab-item tab-show" id="material">
                		<form class="layui-form layui-clear" action="{:url('duty/ajax.panorama/getMaterialList')}" method="post">
                			<div class="layui-form-item">
							    <div class="layui-input-block">
							      <input type="radio" name="categoryId" value="1" title="装备"  lay-filter="linkage" data-url="{:url('duty/ajax.panorama/getMaterialType')}" data-child="material_type" checked>
							      <input type="radio" name="categoryId" value="2" title="物资"  lay-filter="linkage" data-url="{:url('duty/ajax.panorama/getMaterialType')}" data-child="material_type">
							    </div>
							    <div class="layui-input-block">
 							 		<select name="typeId" id="material_type" lay-filter="side-tab-search"></select>
 							 	</div>
 							 	<div class="layui-input-block">
 							 		<ul class="order-list">
 							 			<li>
 							 				<input type="radio" name="order" id="material_default" lay-filter="order" value="id" checked>
 							 				<label for="material_default">默认</label>
 							 			</li>
 							 			<li>
 							 				<input type="radio" name="order" id="total" lay-filter="order" value="materialTotal">
 							 				<label for="total">数量</label>
 							 			</li>
 							 			<li>
 							 				<input type="radio" name="order" value="distance" lay-filter="order" id="material_distance">
 							 				<label for="material_distance">距离</label>
 							 			</li>
 							 		</ul>
 							 	</div>
 							 </div>
                		</form>
                		<div class="tab-list" id="material_list" data-url="{:url('duty/ajax.panorama/getMaterialList')}">
                    
    					</div>
                	</div>
                	<div class="tab-item" id="rescue">
                		<form class="layui-form layui-clear" action="{:url('duty/ajax.panorama/getRescueList')}" method="post">
                			<div class="layui-form-item">
							    <div class="layui-input-block">
							      <select name="categoryId" id="resuce_category" lay-filter="linkage" data-url="{:url('duty/ajax.panorama/getRescueType')}" data-child="resuce_type">
							      	<option></option>
							      	<option value="1">救援团队</option>
							      	<option value="2">保障机构</option>
							      	<option value="3">技术支持</option>
							      </select>
							    </div>
							    <div class="layui-input-block">
 							 		<select name="typeId" id="resuce_type" lay-filter="side-tab-search"></select>
 							 	</div>
 							 	<div class="layui-input-block">
 							 		<ul class="order-list">
 							 			<li class="col-2">
 							 				<input type="radio" name="order" id="resuce_default" lay-filter="order" value="id" checked>
 							 				<label for="resuce_default">默认</label>
 							 			</li>
 							 			<li class="col-2">
 							 				<input type="radio" name="order" id="time" lay-filter="order" value="arriveTime">
 							 				<label for="time">达到时间</label>
 							 			</li>
 							 		</ul>
 							 	</div>
 							 </div>
                		</form>
                		<div class="tab-list" id="rescue_list" data-url="{:url('duty/ajax.panorama/getRescueList')}">
                    
    					</div>
                	</div>
                	<div class="tab-item" id="danger_source">
                		<form class="layui-form layui-clear" action="{:url('duty/ajax.panorama/getDangersourceList')}" method="post">
                			<div class="layui-form-item">
							    <div class="layui-input-block">
							      <select name="sourceType" id="source_category" lay-filter="linkage" data-url="{:url('duty/ajax.panorama/getDangersourceType')}" data-child="source_type">
							      	<option></option>
							      	<option value="1">危险源</option>
							      	<option value="2">危化品库</option>
							      </select>
							    </div>
							    <div class="layui-input-block">
 							 		<select name="typeId" id="source_type" lay-filter="side-tab-search"></select>
 							 	</div>
 							 	<div class="layui-input-block">
 							 		<ul class="order-list">
 							 			<li>
 							 				<input type="radio" name="order" id="danger_default" lay-filter="order" value="id" checked>
 							 				<label for="danger_default">默认</label>
 							 			</li>
 							 			<li>
 							 				<input type="radio" name="order" id="status" lay-filter="order" value="status">
 							 				<label for="status">状态</label>
 							 			</li>
 							 			<li>
 							 				<input type="radio" name="order" value="distance" lay-filter="order" id="danger_distance">
 							 				<label for="danger_distance">距离</label>
 							 			</li>
 							 		</ul>
 							 	</div>
 							 </div>
                		</form>
                		<div class="tab-list" id="danger_source_list" data-url="{:url('duty/ajax.panorama/getDangersourceList')}">
                    
    					</div>
                	</div>
                </div>
            </div>
        </div>
		{/if}
        </div>
</div>
{if $id}
<div class="sensor-view" id="sensorView"></div>
{/if}
{/block}
{block name="script"}
<script type="text/javascript">
	{if $routes}
	var routes = {$routes};
	{else if}
	var routes=0;
	{/if}
</script>
<script src="//webapi.amap.com/ui/1.0/main.js?v=1.0.11"></script>
<script type="text/javascript" src="__JS__/common/map_tool.js"></script>
<script type="text/javascript" src="__JS__/duty/map.js"></script>
<script type="text/javascript" src="__JS__/duty/panorama.js"></script>

<script>
    function tabWidth(){
        var a=$(window).width();
        var b=a - 200 ;
        $("#matter").css("width",b+"px");
    }
    $(document).ready(function(){
        tabWidth();
    });
    $(window).resize(function(){
        tabWidth();
    });
</script>
<script type="text/html" id="toolDemo">
    <div>
        {{# if(d.actionStatus==0){ }}
        <a class="layui-btn   layui-btn-mini" lay-event="add" id="add_{{d.id}}" data-url="{:url('duty/panorama/addActionStep')}?actionstepId={{d.id}}">确认</a>
        {{# } }}

        {{# if(d.actionStatus==1){ }}
        <a class="layui-btn layui-btn-primary  layui-btn-disabled  layui-btn-mini"  >执行中</a>
        {{# } }}

        {{# if(d.actionStatus==2){ }}
        <a class="layui-btn layui-btn-primary  layui-btn-disabled  layui-btn-mini"  >已执行</a>
        {{# } }}
    </div>
</script>
<script type="text/html" id="materialTemplet">
		<ul>
			{{# for(var i = 0;i < d.length; i++){ }}
			<li>
				<div class="layui-row">
					<div class="list-content layui-col-xs5">
						{{# if(d[i].imgPath){ }}
						<img src="__PUBLIC__{{d[i].imgPath}}">
						{{# }else{ }}
						<img src="__STATIC__/img/base/noImg.png" style="background:#fff">
						{{# } }}
					</div>
					<div class="list-content  layui-col-xs7" >
						<p>{{d[i].material}} <span>{{d[i].materialTotal}}({{d[i].unitId}})</span></p>
						<p>{{d[i].enterprise.fullName}}</p>
					</div>
				</div>
			</li>
			{{# } }}
		</ul>
</script>
<script type="text/html" id="rescueTemplet">
		<ul>
			{{# for(var i = 0;i < d.length; i++){ }}
			<li>
				<div class="layui-row">
					<div class="list-content layui-col-xs4">
						<p style="font-size:14px;color:#1c7dfa">{{d[i].fullName}}</p>
					</div>
					<div class="list-content layui-col-xs8">
						<p>{{d[i].address}}</p>
						<p>到达时间: {{d[i].arriveTime}}(分)</p>
						<p>负责人: {{d[i].chargePerson}}</p>
						<p>联系电话: {{d[i].tel1}}</p>
						<p>手机:{{d[i].mobile1}}</p>
					</div>
				</div>
			</li>
			{{# } }}
		</ul>
</script>
<script type="text/html" id="danger_sourceTemplet">
		<ul>
			{{# for(var i = 0;i < d.length; i++){ }}
			<li>
				<div class="layui-row">
					<div class="list-content layui-col-xs5">
						{{# if(d[i].imgPath){ }}
						<img src="__PUBLIC__{{d[i].imgPath}}">
						{{# }else{ }}
						<img src="__STATIC__/img/base/noImg.png" style="background:#fff">
						{{# } }}
					</div>
					<div class="list-content  layui-col-xs7" >
						<p>{{d[i].name}}</p>
						{{# if(d[i].status == 2){ }}
						<p>状态: <span style="color:#f35857"><i class="fa fa-bell"></i></span>
						{{# }else{ }}
						<p>状态: <span style="color:#52d669"><i class="fa fa-check"></i></span>
						{{# } }}
						<p>{{d[i].enterprise.fullName}}</p>
					</div>
				</div>
			</li>
			{{# } }}
		</ul>
</script>
<script type="text/html" id="sensorDemo">
	<ul>
		{{# for(var i = 0;i < d.length; i++){ }}
		{{# if(d[i].status){ }}
		<li class="normal">{{d[i].title}}</li>
		{{# }else{ }}
		<li class="abnormal">{{d[i].title}}</li>
		{{# } }}
		{{# } }}
	</ul>
</script>
<script type="text/html" id="sensorDetail">
	<div class="sensor-detail">
		{{# if(d.status == 1){ }}
		<div class="sensor-info normal">
			<p class="title">{{d.title}}</p>
			<p class="dangersource">({{d.dangersource.name}})---[{{{{d.dangersource.enterprise.shortname}}}}]</p>
		</div>
		{{# } }}
		{{# if(d.status == 0){ }}
		<div class="sensor-info abnormal">
			<p class="title">{{d.title}}</p>
			<p class="dangersource">({{d.dangersource.name}})---[{{d.dangersource.enterprise.shortname}}]</p>
		</div>
		{{# } }}
		<div class="sensor-contact">
			<div class="phone">
				<div class="icon">
					<i class="fa fa-phone-square"></i>
				</div>
				<div class="number">
					<p>{{d.dangersource.staff.tel}}</p>
					<p>{{d.dangersource.staff.mobile}}</p>
				</div>
			</div>
			<div class="contact">
				<p>{{d.dangersource.staff.staffName}}</p>
			</div>
		</div>
		{{# if(d.status == 0){ }}
		<div class="layui-btn handle-btn" data-alarm="{{d.alarm}}"><i class="fa fa-bell-slash"></i></div>
		{{# } }}
	</div>
</script>
{/block}

